﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
<base href="<%=basePath%>">
		<!-- ace styles -->
<link href="plugins/js/core.css" rel="stylesheet" />
<link href="plugins/js/bootstrap-3.3.2-dist/css/bootstrap.min.css" rel="stylesheet" />
<script src='static/js/jquery-2.1.3.min.js'></script>
<script type="text/javascript" src="plugins/js/bootstrap-3.3.2-dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="plugins/js/jquery.bootstrap.min.js"></script>
<script type="text/javascript" src="static/js/layer.js"></script>
<script type="text/javascript" src="plugins/jquery.form.js"></script>
<script type="text/javascript" src="static/js/jquery.twbsPagination.min.js"></script>
<link rel="stylesheet" href="static/css/layui.css" media="all">
<style type="text/css">
	td.center, th.center {
  	  text-align: center !important;
	}
</style>
<script type="text/javascript">
		$(function(){
			$(top.hangge());
			
			$('#pagination').twbsPagination({
				totalPages : ${pageResult.totalPage},
				startPage : ${pageResult.currentPage},
				visiblePages : 5,
				first : "首页",
				prev : "上一页",
				next : "下一页",
				last : "最后一页",
				onPageClick : function(event, page) {
					$("#currentPage").val(page);
					$("#searchForm").submit();
				}
			});
			
			//点击分组,查询分组下的明细
			$(".group_item").click(function(){
				$("#currentPage").val(1);
				$(this).addClass("active");
				$("#parentId").val($(this).data("dataid"));
				$("#searchForm").submit();
			});
			
			//页面刷新的时候,根据当前的parentid把分组选中
			var parentIdValue=$("#parentId").val();
			if(parentIdValue){
				$("[data-dataid="+parentIdValue+"]").closest("li").addClass("active");
			}
			
			//点击添加明细
			$("#addSystemDictionaryItemBtn").click(function(){
				if(parentIdValue){
					$("#editFormParentId").val(parentIdValue);
					$("#systemDictionaryItemModal").modal("show");
				}else{
					layer.alert("请先选择一个分组!");
				}
			});
			
			//修改或者保存
			$("#editForm").ajaxForm(function(){
				$.messager.confirm("提示","编辑成功",function(){
					$("#searchForm").submit();
				});
			});
			$("#saveBtn").click(function(){
				$("#editForm").submit();
			});
			
			//修改
			$(".edit_Btn").click(function(){
				var json=$(this).data("json");
				$("#systemDictionaryId").val(json.id);
				$("#editFormParentId").val(json.parentId);
				$("#title").val(json.title);
				$("#sequence").val(json.sequence);
				$("#systemDictionaryItemModal").modal("show");
			});
		});
        function delete1(id){
            layer.confirm('你确定要删除该选项？', {
                btn: ['删除','保留'] //按钮
            }, function(){
                $.ajax({
                    type: "get",
                    url: "systemDictionaryItem_delete3.do?id=" + id,
                    async: true,
                    success: function (data) {
                        layer.msg("已删除id：" + id + "返回值：" + data, {icon: 1});
                        window.location.reload();
                    }
                });
            }, function(){
                layer.msg('已保留');
            });

        }
		</script>
</head>

<body>
<div>
	<div>
		<div class="page-header">
			<h3>数据字典明细管理</h3>
		</div>
			<!-- 提交分页的表单 -->
			<form id="searchForm" class="form-inline" method="post"
				action="<%=basePath%>/systemDictionaryItem_list.do">
				<input type="hidden" id="currentPage" name="currentPage"
					value="${qo.currentPage}" />
				<input type="hidden" id="parentId" name="parentId"
					value='${qo.parentId}' />
				<div class="form-group">
					<label>关键字</label>
					<input class="form-control" type="text" name="keyword"
						value="${qo.keyword}">
				</div>
				<div class="form-group">
					<button id="query" class="btn btn-success">
						<i class="icon-search"></i> 查询
					</button>
					<a href="javascript:void(-1);" class="btn btn-success"
						id="addSystemDictionaryItemBtn">添加数据字典明细</a>
				</div>
			</form>
		</div>
		<div class="row" style="margin-top: 20px;">
						<div class="col-sm-3">
							<ul id="menu" class="list-group">
								<li class="list-group-item"><a href="#"
									data-toggle="collapse"
									data-parent="#systemDictionary_group_detail">
									<span>数据字典分组</span></a>
									<ul class="in" id="systemDictionary_group_detail">
										<c:forEach items="${systemDictionaryGroups}" var="vo" varStatus="vs">
										<li><a class="group_item" data-dataid="${vo.id}"
											href="javascript:;"><span>${vo.title}</span></a></li>
										</c:forEach>
									</ul></li>
							</ul>
						</div>
						<div class="col-sm-9">
							<table class="table table-hover">
								<thead>
									<tr>
										<th>名称</th>
										<th>序列</th>
										<th>操作</th>
									</tr>
								</thead>
								<tbody>
									<c:forEach items="${pageResult.listData}" var="vo" varStatus="vs">
									<tr>
										<td>${vo.title}</td>
										<td>${vo.sequence}</td>
										<td>
											<a href="javascript:void(-1);" class="edit_Btn"
												data-json='${vo.jsonstring}'>修改</a> &nbsp;
                                            <a href="javascript:void(-1);"
                                                onclick="delete1('${vo.id}')">删除</a> &nbsp;
										</td>
									</tr>
									</c:forEach>
									<c:if test="${empty pageResult.listData}">
										<tr class="main_info">
											<td colspan="100" class="center">没有相关数据</td>
										</tr>
									</c:if>
								</tbody>
							</table>

							<div style="text-align: center;">
								<ul id="pagination" class="pagination"></ul>
							</div>

						</div>
					</div>
</div>
<div id="systemDictionaryItemModal" class="modal" tabindex="-1"
		role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title">编辑/增加</h4>
				</div>
				<div class="modal-body">
					<form id="editForm" class="form-horizontal" method="post"
						action="systemDictionaryItem_update.do" style="margin: -3px 118px">
						<input id="systemDictionaryId" type="hidden" name="id" value="" />
						<input type="hidden" id="editFormParentId" name="parentId"
							value="" />
						<div class="form-group">
							<label class="col-sm-3 control-label">名称</label>
							<div class="col-sm-6">
								<input type="text" class="form-control" id="title" name="title"
									placeholder="字典值名称">
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-3 control-label">顺序</label>
							<div class="col-sm-6">
								<input type="text" class="form-control" id="sequence"
									name="sequence" placeholder="字典值显示顺序">
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<a href="javascript:void(0);" class="btn btn-success" id="saveBtn"
						aria-hidden="true">保存</a> <a href="javascript:void(0);"
						class="btn" data-dismiss="modal" aria-hidden="true">关闭</a>
				</div>
			</div>
		</div>
	</div>
</body>
</html>

